// components/test3/test3.js
Component({
    options: {
        // 纯数据规则
        pureDataPattern: /^_/
    },
    /**
     * 组件的属性列表
     */
    properties: {

    },

    /**
     * 组件的初始数据
     */
    data: {
        _rgb: {
            r: 0,
            g: 0,
            b: 0
        },
        fullColor: "0,0,0"
    },

    /**
     * 组件的方法列表
     */
    methods: {
        changeR() {
            this.setData({
                '_rgb.r': this.data._rgb.r + 5 > 255 ? 255 : this.data._rgb.r + 5
            })
        },
        changeG() {
            this.setData({
                '_rgb.g': this.data._rgb.g + 5 > 255 ? 255 : this.data._rgb.g + 5
            })
        },
        changeB() {
            this.setData({
                '_rgb.b': this.data._rgb.b + 5 > 255 ? 255 : this.data._rgb.b + 5
            })
        },
        // 随机颜色生成
        _randomColor() {
            this.setData({
                _rgb: {
                    r: Math.floor(Math.random() * 256),
                    g: Math.floor(Math.random() * 256),
                    b: Math.floor(Math.random() * 256),
                }
            })

        }

    },
    // 监听器
    observers: {
        // '_rgb.r,_rgb.g,_rgb.b': function (r, g, b) {
        //     this.setData({
        //         fullColor: `${r},${g},${b}`
        //     })
        //     console.log(r, 'r');
        //     console.log(g, 'g');
        //     console.log(b, 'b');
        // }
        // 通配符
        '_rgb.**': function (obj) {
            this.setData({
                fullColor: `${obj.r},${obj.g},${obj.b}`
            })
        }
    },
    // 组件生命周期
    lifetimes: {
        // 创建时
        created() {
            console.log('created----');
        },
        // 组件实例进入页面节点树时
        attached() {
            console.log("attched--");
        },
        // 组件被页面节点移除时
        detached() {
            console.log("detached0--");
        }
    },
    // 页面生命周期
    pageLifetimes: {
        // 展示时
        show() {
            console.log('show');
            this._randomColor()
        },
        // 隐藏
        hide() {
            console.log('hide');
        },
        // 尺寸大小变化
        resize() {
            console.log('resize');
        }
    }
})